// 运行检测
<template>
  <div class="big_box" id="userBig2">
    <el-tabs class="scorllFixed" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane :label="item.name" :name="item.path" v-for="item in jurisdiction" :key="item.name">
        <router-view v-if="activeName === item.path"></router-view>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import { setUrl } from '../../utils/getUrl.js'
// import { pinT } from '@/utils/allUrl.js'
import { getAuthority } from '@/assets/js/getAuthority.js'
export default {
  data() {
    return {
      activeName: 'faultSnapshot',
      jurisdiction: [
        // {
        //   title: '故障快照',
        //   url: 'faultSnapshot'
        // },
        // {
        //   title: '录像状况',
        //   url: 'videotape'
        // },
        // {
        //   title: '抓拍设备检测',
        //   url: 'captureSB'
        // },
        // {
        //   title: '前卫主机',
        //   url: 'qwHost'
        // },
        // {
        //   title: '拍摄质量诊断',
        //   url: 'captureQuality'
        // },
        // {
        //   title: '最近一小时上下线设备',
        //   url: 'latelySB'
        // }
      ],
    }
  },
  watch: {
    jurisdiction: {
      deep: true,
      handler(newVal, oldVal) {
        // console.log(newVal, oldVal)
        this.jurisdiction = newVal // 保存列表
        this.activeName = this.$route.name
        this.$router.push(this.$route.path)
      },
    },
    // 监听url中的hash值的变化
    $route(to, from) {
      const hashUrl = window.location.hash.substr(2)
      if (hashUrl.startsWith('faultSnapshot')) {
        this.activeName = 'faultSnapshot'
      } else if (hashUrl.startsWith('videotape')) {
        this.activeName = 'videotape'
      } else if (hashUrl.startsWith('captureSB')) {
        this.activeName = 'captureSB'
      } else if (hashUrl.startsWith('qwHost')) {
        this.activeName = 'qwHost'
      } else if (hashUrl.startsWith('captureQuality')) {
        this.activeName = 'captureQuality'
      } else if (hashUrl.startsWith('latelySB')) {
        this.activeName = 'latelySB'
      } else if (hashUrl.startsWith('donlihjOverview')) {
        this.activeName = 'donlihjOverview'
      } else if (hashUrl.startsWith('serverOverview')) {
        this.activeName = 'serverOverview'
      }
    },
  },
  created() {
    getAuthority(this, 'runTesting') // 获取权限
    // // 判断本地存储中是否有地址
    // const url = getUrl('runTesting')
    // if (!url) return (this.activeName = this.jurisdiction[0].path)
    // this.activeName = url
  },
  mounted() {
    // startLoading(document.getElementById('userBig2'))
  },
  destroyed() {
    // 默认
    setUrl('runTesting', '')
  },
  methods: {
    // 刷新右侧需要调用的函数
    getChildRefresh() {
      getAuthority(this, 'runTesting') // 获取权限
    },
    handleClick(tab, event) {
      // 防止一直加载动画
      // if (window.location.hash.substr(2) !== tab.name) {
      //   startLoading(document.getElementById('userBig2'))
      // }
      setUrl('runTesting', tab.name)
      if (tab.name === 'faultSnapshot') {
        this.$router.push('/faultSnapshot')
      } else if (tab.name === 'videotape') {
        this.$router.push('/videotape')
      } else if (tab.name === 'captureSB') {
        this.$router.push('/captureSB')
      } else if (tab.name === 'qwHost') {
        this.$router.push('/qwHost')
      } else if (tab.name === 'captureQuality') {
        this.$router.push('/captureQuality')
      } else if (tab.name === 'latelySB') {
        this.$router.push('/latelySB')
      } else if (tab.name === 'donlihjOverview') {
        this.$router.push('/donlihjOverview')
      } else if (tab.name === 'serverOverview') {
        this.$router.push('/serverOverview')
      }
      // endLoading()
    },
  },
}
</script>

<style lang="scss" scoped>
.big_box {
  background-color: #f2f2f2;
}
</style>
